import { getEnergyAnalyzeEnterpriseConsume } from '@/api/energy';

import { defaultNumber } from '@/utils'

export default {
  props: {
    color: {
      type: String,
      default: '#6610f2',
    },
    energyType: {
      type: String,
      required: true,
    }
  },
  data () {
    return {
      data: {},
    }
  },
  computed: {
    enterpriseId () {
      return this.$route.query.enterpriseId
    },
    title () {
      return this.data.name || '';
    },
    serie () {
      return this.data.series && this.data.series[0]
        ? this.data.series[0]
        : {};
    },
    unit () {
      return this.serie.unit || '';
    },
    chartOption () {
      const unit = this.unit;
      return {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'cross'
          },
          valueFormatter: value => `${defaultNumber(value)} ${unit}`
        },
        xAxis: {
          type: 'category',
          data: this.data.xaxis ? this.data.xaxis.data : [],
        },
        yAxis: {
          type: 'value',
          name: unit,
        },
        series: [
          {
            type: 'line',
            name: this.title,
            itemStyle: {
              color: this.color,
            },
            smooth: true,
            data: this.serie.data || []
          }
        ]
      }
    }
  },
  watch: {
    month () {
      this.loadList()
    },
    enterpriseId (val) {
      this.loadList()
    },
    energyType (val) {
      this.loadList();
    }
  },
  mounted () {
    // console.log(this.energyType, this.enterpriseId);
    this.loadList();
  },
  methods: {
    async loadList () {
      const energyType = this.energyType;
      const enterpriseId = this.$route.query.enterpriseId;
      if (!enterpriseId || !energyType) {
        console.warn(`[getEnergyItem]: enterpriseId is ${enterpriseId}`);
        console.warn(`[getEnergyItem]: energyType is ${energyType}`);
        return;
      }
      try {
        const { data } = await getEnergyAnalyzeEnterpriseConsume(energyType, enterpriseId, {
          time: this.month,
          timeType: '1M'
        });
        this.data = data;
      } catch (e) {
        console.warn(e);
      }
    }
  }
}
